.detail-box{
  box-sizing: border-box;
  width: 100%;
  padding: 0 30px;
  .title{
    margin: 30px 0;
    font-size: 43px;
    text-align: center;
  }
  .post-date{
    text-align: left;
    font-size: 18px;
    color: #8b8b8b;
    margin-bottom: 20px;
  }
  .desc-box{
    box-sizing: border-box;
    width: 100%;
    padding: 24px;
    margin-bottom: 30px;
    background: rgba(240, 240, 240,1);
    color: #868686;
    font-size: 24px;
  }
  .btn-box{
    box-sizing: border-box;
    width: 640px;
    margin-left: -30px;
    padding: 50px 0;
    height: 156px;
    background: rgba(248,248,248,1);
    color: #707070;
    font-size: 24px;
    .pre{
      p{
        text-align: right;
      }
      .iconfont{
        left: 20px;
        &:before{
          content: "\e687";
        }
        
      }
    }
    .next{
      .iconfont{
        right: 20px;
        &:before{
          content: "\e6ae";
        }
      }
    }
    .btn-item{
      box-sizing: border-box;
      height: 56px;
      width: 320px;
      padding-left: 40px;
      position: relative;
      .iconfont{
        color: #e2e2e2;
        position: absolute;
        top: 50%;
        transform: translate(0,-50%);
        font-size: 32px;
      }
      p{
        height: 26px;
        line-height: 26px;
        width: 245px;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
      }
      span{
        font-size: 28px;
      }
      &:first-child{
        padding-right: 40px;
        border-right: 1px solid #cbcbcb;
      }
    }
  }
  .img-item{
    margin-bottom: 48px;
    img{
      width: 100%;
    }
  }
}